<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button>所有桌台查询</button><br>
    <button>添加一个桌台</button><br>
    <button>删除3号桌台</button><br>
    <button>修改14号桌台</button><br>
    <hr> 
    <!-- 引入axios  -->
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>

    <!-- 查询 -->
    <script>
        document.querySelectorAll('button')[0].onclick=()=>{
            //get方法没有请求主体 可使用/aname/apwd 传参 
            axios.get('http://127.0.0.1:8090/tables').then(res=>{ 
                console.log(res.data)
            }).catch(err=>{
                console.log(err)
            })
        }
    </script>
    <!-- 增加桌台 -->
    <script>
           document.querySelectorAll('button')[1].onclick=()=>{
               //传参
               let data = {tname:"新增桌台",type:"2-3人桌",status:1}
                axios.post('http://127.0.0.1:8090/tables',data).then(res=>{ 
                console.log(res.data)
            }).catch(err=>{
                console.log(err)
            })
        }
    </script>


    <!-- 删除桌台 -->
    <script>
          document.querySelectorAll('button')[2].onclick=()=>{ 
                axios.delete('http://127.0.0.1:8090/tables/3').then(res=>{ 
                console.log(res.data)
            }).catch(err=>{
                console.log(err)
            })
        }
    </script>


    <!-- 修改桌台信息 -->
    <script>
       document.querySelectorAll('button')[3].onclick=()=>{ 
           let data={tid:124,tname:'被改动aa',type:'3-4人',status:3}
                axios.put('http://127.0.0.1:8090/tables',data).then(res=>{ 
                console.log(res.data)
            }).catch(err=>{
                console.log(err)
            })
        }
    </script>
    
</body>
</html>